<template>
	<view class="chongzhi2">
		<view class="item">
			<span>充值金额</span>
			<p>可以余额：$0.00</p>
		</view>
		<helang-checkbox ref="checkbox" @change="valueChange"></helang-checkbox>
		<view class="item">
			<p>当前金额为</p>
			<span>{{ number }}元</span>
		</view>
		<view class="uni-form-item uni-column">
			<view class="title">输入金额（$）</view>
			<input class="uni-input" v-model="jine" type="digit" placeholder="输入金额" />
		</view>
		<view class="box"><button class="btn" @click="rechargeClick" type="primary">快速充值</button></view>
	</view>
</template>

<script>
import helangCheckbox from '../../components/helang-checkbox/helang-checkbox.vue';
import { recharge } from '../../server/api.js';
export default {
	components: {
		'helang-checkbox': helangCheckbox
	},
	data() {
		return {
			number: 720,
			jine: ''
		};
	},
	mounted() {
		this.dataInit();
	},
	methods: {
		dataInit() {
			this.$refs.checkbox.set({
				type: 'radio', // 类型：单选框
				index: 0, // 默认选中的项
				column: 3, // 分列
				list: [
					// 列表数据
					{ text: '$100.00', num: 100 },
					{ text: '$200.00', num: 200 },
					{ text: '$500.00', num: 500 },
					{ text: '$1000.00', num: 1000 },
					{ text: '$10000.00', num: 10000 }
				]
			});
		},
		valueChange(data) {
			this.number = data.num * 7.2;
			console.log(data);
		},
		rechargeClick() {
			let chongzhi = '';
			if (this.jine) {
				chongzhi = this.jine;
			} else {
				chongzhi = this.number;
			}
			console.log('111111');
			let that = this;
			uni.getStorage({
				key: 'UserInfo',
				success: function(user) {
					console.log(user);
					let userId = user.data.data[0].UserId;
					let params = {};
					params.user_id = userId;
					params.money = chongzhi;
					console.log(params);
					that.qRecharge(params);
				}
			});
		},
		qRecharge: async function(params) {
			let data = await recharge(params);
			console.log(data);
			plus.nativeUI.toast(data.data.returnval);
			// if(data.result==0){
			// 	plus.nativeUI.toast(data.returnval);
			// }else{
			// 	plus.nativeUI.toast(data.returnval);
			// }
		}
	}
};
</script>

<style lang="less">
.chongzhi2 {
	padding: 30upx;
	.item {
		margin-bottom: 30upx;
		display: flex;
		justify-content: space-between;
		font-size: 30upx;
		line-height: 110upx;
		height: 110upx;
		// border-bottom: 1px solid #ddd;
		p {
			color: #999;
		}
		span {
			color: #333;
		}
	}
	.title {
		font-size: 28upx;
		line-height: 40upx;
		margin-bottom: 20upx;
	}
	.uni-input {
		font-size: 34upx;
	}
	.box {
		height: 200upx;
		.btn {
			margin-top: 60upx;
			font-size: 32upx;
		}
	}
}
</style>
